import React from 'react'
import { Table, Tag, space,Pagination,Button } from 'antd';
import {connect} from 'dva';
import PropTypes from 'prop-types';
import { Link } from 'react-router-dom'
import { stringify } from 'querystring'
import styles from '../Cooperative.less'

@connect(({cooperativeStore})=>({
    list: cooperativeStore.list,
}))
class MyCooperativeList extends React.Component{
    state={
        shopList:[],

        pageIndex: 1,
        pageSize: 20,
        total: '',
    }

    componentDidMount(){
        //  this.onChangeCurPageOrPageSize(1, 2)
        const { dispatch } = this.props;
        dispatch({
            type: 'cooperativeStore/queryShopSign',
            payload:{
                data:{
                    // "pageIndex": 1,
                    // "pageSize": 2,
                    // "platform": 0,
                    // "resourcesName": "上海虹桥常规专车揽收-A供应商",
                    // "resourcesType": 1,
                    // "serviceAirport": 0
                  }
            }
        }).then(res => {
            if(res.code==200){
                this.setState({
                    shopList:res.data.queryShopSignDto.resultList,
                })
            }
        });
    }
    render() {
        const {shopList}=this.state;
        const columns = [
            {
                title: '序号',
                dataIndex: 'index',
                align: 'center',
                render:(text,record,index)=>`${index+1}`,
            },
            {
                title: '服务名称',
                dataIndex: 'resourcesName',
                align: 'center'
            },
            ,
            {
                title: '服务类型',
                dataIndex: 'resourcesType',
                align: 'center'
            },
            {
                title: '店铺',
                dataIndex: 'shopName',
                align: 'center',
                render: text => <a>{text}</a>
            },
            {
                title: '服务机场',
                dataIndex: 'serviceAirport',
                align: 'center'
            },
            {
                title: '特殊服务',
                dataIndex: 'specialService',
                align: 'center'
            },
            {
                title: '车辆类型',
                dataIndex: 'vehicleType',
                align: 'center'
            },
            {
                title: '运输类型',
                dataIndex: 'transportType',
                align: 'center'
            },
            {
                title: '签约时间',
                dataIndex: 'signTime',
                align: 'center'
            },
            {
                title: '价格有效期',
                dataIndex: 'cooperateTime',
                align: 'center'
            },
            {
                title: '服务状态',
                dataIndex: 'supplierSignStatus',
                align: 'center',
                render: (text, record) =>{
                    let span ='';
                    if(record.supplierSignStatus == 1){
                        span = <span style={{color:'#343434'}}>有效</span>
                    }else if (record.supplierSignStatus == 2){
                        span = <span style={{color:'#F5222E'}}>失效</span>
                    }else if (record.supplierSignStatus == 3){
                        span = <span style={{color:'#EB6F4E'}}>续用中</span>
                    }else if (record.supplierSignStatus == 4){
                        span = <span style={{color:'#EB6F4E'}}>已停用</span>
                    }else if (record.supplierSignStatus == 5){
                        span = <span style={{color:'#EB6F4E'}}>停用中</span>
                    }else if (record.supplierSignStatus == 6){
                        span = <span style={{color:'#EB6F4E'}}>调价中</span>
                    }
                    return(<div>{span}</div> )

                }
            },
            {
                title: '操作',
                key: 'action',
                align: 'center',
                render: (text,record) => {
                    let query = {
                        BasicInfoId:record.id,
                   };
                   let span ='';
                    if(record.supplierSignStatus == 1){
                        span = <span>
                            <Link to = {`/CooperativeStore?${stringify(query)}`}>申请停用</Link>&nbsp;
                            <Link to = {`/CooperativeStore?${stringify(query)}`}>调价</Link>
                        </span>
                        // span = <span><Link to = {`/CooperativeStore?${stringify(query)}`}>调价</Link></span>
                    }else if (record.supplierSignStatus == 2){
                        span = <span><Button onClick={()=>this.del(record.id)} className={styles.antBtn}> 删除</Button></span>
                    } else if (record.supplierSignStatus == 3){
                        span = <span><Link to = {`/CooperativeStore?${stringify(query)}`}>处理</Link></span>
                    }else if (record.supplierSignStatus == 4){
                        span = <span><Link to = {`/CooperativeStore?${stringify(query)}`}>处理</Link></span>
                    }else if (record.supplierSignStatus == 5){
                        span = <span><Link to = {`/CooperativeStore?${stringify(query)}`}>处理</Link></span>
                    }else if (record.supplierSignStatus == 6){
                        span = <span><Link to = {`/CooperativeStore?${stringify(query)}`}>处理</Link></span>
                    }
                    return(<div>{span}</div> )
                    
                }
            },
        ];
        const dataSource = [
            {
                key: '1',
                index: 1,
                name: '上海店铺',
                ResourceName: '虹桥常规专车揽收-供应商',
                ResourceType: '揽收',
                airport: '上海虹桥',
                serverce: '不限',
                signingTime:'2020-11-05 10:12:05',
                time: '2020-10-16 10:12:05',
                status:'未处理'
            },
            {
                key: '2',
                index: 2,
                name: '上海店铺',
                ResourceName: '浦东常规专车揽收-供应商',
                ResourceType: '派送',
                airport: '上海虹桥',
                serverce: '不限',
                signingTime:'2020-11-05 10:12:05',
                time: '2020-10-16 10:12:05',
                status:'已发送待确认'
            },
            {
                key: '3',
                index: 3,
                name: '北京店铺',
                ResourceName: '浦东常规专车揽收-供应商',
                ResourceType: '派送',
                airport: '上海虹桥',
                serverce: '不限',
                signingTime:'2020-11-05 10:12:05',
                time: '2020-10-16 10:12:05',
                status:'已发送待确认'
            },
            {
                key: '4',
                index: 4,
                name: '河南店铺',
                ResourceName: '浦东常规专车揽收-供应商',
                ResourceType: '派送',
                airport: '上海虹桥',
                serverce: '不限',
                signingTime:'2020-11-05 10:12:05',
                time: '2020-10-16 10:12:05',
                status:'已发送待确认'
            },
            {
                key: '5',
                index: 5,
                name: '南京店铺',
                ResourceName: '浦东常规专车揽收-供应商',
                ResourceType: '派送',
                airport: '上海虹桥',
                serverce: '不限',
                signingTime:'2020-11-05 10:12:05',
                time: '2020-10-16 10:12:05',
                status:'已发送待确认'
            },
        ];
        
        return (
            <div>
                <Table columns={columns} dataSource={shopList} 
                    pagination={{
                        showSizeChanger: true,
                        showQuickJumper: true,
                        defaultCurrent: 1,
                        // total: 500,
                        total: this.state.total,
                        defaultPageSize:10,
                        pageSizeOptions:[10, 20, 50, 100],
                        showTotal: total => `共 ${total} 条`,
                        pageIndex: this.state.pageIndex,
                        onChange: this.changePage,
                      }}
                />
               
            </div>
        )
    }
    changePage = page => {
        this.setState({
          pageIndex: page,
        });
      };
}
export default MyCooperativeList